<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>购物车</title>
    <link href="css/reset.css" rel="stylesheet">
    <link href="css/main.css" rel="stylesheet">

</head>
<body>
<div class="headerBar">
    <div class="topBar">
        <div class="comWidth">
            <div class="leftArea">
                <a href="#" class="collection">收藏慕课</a>
            </div>
            <div class="rightArea">
                欢迎来到慕课网！<a href="#">[登陆]</a><a href="#">[免费注册]</a>

            </div>
        </div>
    </div>
    <div class="logoBar">
        <div class="comWidth">
            <div class="logo fl">
                <img src="images/logo.jpg" alt="慕课网">
            </div>
            <div class="stepBox fr">
                <div class="step"></div>
                <ul class="step-text">
                    <li class="s01 active">我的购物车</li>
                    <li class="s02 active">核对你的订单</li>
                    <li class="s03">订单提交成功</li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div class="shopping-cart comWidth">
    <div class="shopping-item">
        <h3 class="shopping-tit">收货地址</h3>
        <div class="shopping-cont padding-shop">
            <ul class="shopping-list">
                <li><span class="shopping-list-text"><em>*</em>选择地区：</span>
                    <div class="select">
                        <h3> 海淀区五环内</h3>
                        <span></span>
                        <ul class="show-select">
                            <li>上帝</li>
                            <li>上帝</li>
                            <li>上帝</li>
                        </ul>
                    </div>
                </li>
                <li><span class="shopping-list-text"><em>*</em>详细地址：</span> <input type="text" value="最多输入20个汉字" class="input input-b"></li>
                <li><span class="shopping-list-text"><em>*</em>收货人：</span><input type="text" value="最多10个" class="input"></li>
                <li><span class="shopping-list-text"><em>*</em>手机：</span><input type="text" value="如123123123" class="input">
                    &nbsp;或固定电话<input type="text" class="input input-s"><span class="jian">-</span><input type="text" class="input"><span class="jian">-</span><input type="text" class="input"> </li>
                <li><input type="button" class="affirm" value="确认收货地址"></li>
            </ul>

        </div>
    </div>
    <div class="hr25"></div>
    <div class="shopping-item">
        <h3 class="shopping-tit">支付方式</h3>
        <div class="shopping-cont padding-shop">
            <ul class="shopping-list">
               <li><input type="radio" class="radio" id="r1"><label for="r1">微信支付</label> </li>
               <li><input type="radio" class="radio" id="r2"><label for="r2">网银支付</label> </li>
            </ul>

        </div>
    </div>
    <div class="hr25"></div>
    <div class="shopping-item">
        <h3 class="shopping-tit">送货清单 <a href="#" class="backCar">返回购物车修改</a> </h3>
        <div class="shopping-cont pb10">
           <div class="cart-inner">
               <div class="cart-head clearfix">
                   <div class="cart-item t-name">商品名称</div>
                   <div class="cart-item t-price">单价</div>
                   <div class="cart-item t-return">返现</div>
                   <div class="cart-item t-num">数量</div>
                   <div class="cart-item t-subtotal">小计</div>
               </div>
               <div class="cart-cont clearfix ">
                   <div class="cart-item t-name">
                       <div class="cart-shopInfo clearfix">
                           <img src="images/item-img1_03.jpg" alt="冰箱">
                           <div class="cart-shopInfo-cont">
                               <p class="cart-link"><a href="#">冰箱</a> </p>
                               <p class="cart-info">好冰箱好冰箱好冰箱好冰箱好冰箱好冰箱好冰箱</p>
                           </div>
                       </div>
                   </div>
                   <div class="cart-item t-price">单价</div>
                   <div class="cart-item t-return">返现</div>
                   <div class="cart-item t-num">数量</div>
                   <div class="cart-item t-subtotal t-red">小计</div>
               </div>
               <div class="cart-message">
                   若有问题请留言
               </div>
               <div class="cart-prompt">
                  <i class="cart-prompt-icon"></i> 抱歉，以下商品无法购买
               </div>
               <div class="cart-cont cart-nobor clearfix">
                   <div class="cart-item t-name">
                       <div class="cart-shopInfo clearfix">
                           <img src="images/item-img1_03.jpg" alt="冰箱">
                           <div class="cart-shopInfo-cont">
                               <p class="cart-link"><a href="#">冰箱</a> </p>
                               <p class="cart-info">好冰箱好冰箱好冰箱好冰箱好冰箱好冰箱好冰箱</p>
                           </div>
                       </div>
                   </div>
               </div>
           </div>

        </div>
    </div>
    <div class="hr25"></div>
    <div class="shopping-item">
    <h3 class="shopping-tit">订单结算</h3>
    <div class="shopping-cont padding-shop clearfix">
       <div class="cart-count fr">
           <div class="cart-rmb">
               <i>总计：</i><span>1000000000459元</span>
           </div>
           <div class="cart-btnBox">
           <input type="button" class="cart-btn" value="提交订单">
           </div>
       </div>

    </div>
</div>

</div>
<div class="hr25"></div>
<div class="footer">
    <p>
        <a href="#">慕课简介</a>
        <i>|</i>
        <a href="#">慕课公告</a>
        <i>|</i>
        <a href="#">招贤纳士</a>
        <i>|</i>
        <a href="#">联系我们</a>
        <i>|</i>客服热线400-675-1234
    </p>
    <p>
        Copyright© 2006 - 2014 慕课版权所有&nbsp;&nbsp;&nbsp;京ICP备09037834号&nbsp;&nbsp;&nbsp;
        京ICP证B1034-8373号&nbsp;&nbsp;&nbsp;某市公安局XX分局备案编号：123456789123
    </p>
    <p class="web">
        <a href="#"><img src="images/footer-logo1.jpg" alt="footer-logo"> </a>
        <a href="#"><img src="images/footer-logo1.jpg" alt="footer-logo"> </a>
        <a href="#"><img src="images/footer-logo1.jpg" alt="footer-logo"> </a>
        <a href="#"><img src="images/footer-logo1.jpg" alt="footer-logo"> </a>
    </p>
</div>
</body>
</html>